<template>
  <div class='container'>
    <el-dialog
      title="题目审核"
      :visible="isShowCheckDialog"
      :width="dialogWidth"
      @close="closeDialog"
      :close-on-click-modal="false">
      <el-form :model="chkData">
        <el-form-item>
          <el-radio v-model="radio" label="1">通过</el-radio>
          <el-radio v-model="radio" label="2">拒绝</el-radio>
        </el-form-item>
        <el-form-item>
            <el-input
              type="textarea"
              style="margin:10px 0 30px 0"
              :rows="3"
              placeholder="请输入审核意见"
              v-model="chkRemarks">
            </el-input>
        </el-form-item>
      </el-form>
        <el-row>
          <el-col :span="24">
            <el-button style="float:right" @click="closeDialog">取消</el-button>
            <el-button style="float:right" type="primary" @click="sureCheck">确认</el-button>
          </el-col>
        </el-row>
    </el-dialog>
  </div>
</template>

<script>
import { choiceCheck } from '@/api/hmmm/questions.js'
export default {
  props: {
    isShowCheckDialog: {
      type: Boolean,
      default: false
    },
    chkData: {
      type: Object,
      default: () => {}
    }
  },
  data () {
    return {
      radio: '1',
      chkRemarks: '',
      dialogWidth: '400px'
    }
  },
  mounted () {
    window.onresize = () => {
      return (() => {
        this.setDialogWidth()
      })()
    }
  },
  methods: {
    // 关闭弹窗
    closeDialog () {
      this.$emit('update:isShowCheckDialog', false)
      this.$parent.choiceQuestions()
    },
    // 确定审核
    async sureCheck () {
      if (this.chkRemarks === '') {
        return this.$message.warning('请完善选项')
      }
      this.radio = +this.radio
      await choiceCheck({ id: this.chkData.id, chkState: this.radio, chkRemarks: this.chkRemarks })
      this.$message.success('操作成功')
      this.radio = '1'
      this.chkRemarks = ''
      this.closeDialog()
    },
    setDialogWidth () {
      var val = document.body.clientWidth
      const def = 400 // 默认宽度
      if (val < def) {
        this.dialogWidth = '100%'
      } else {
        this.dialogWidth = def + 'px'
      }
    }
  }
}
</script>

<style scoped>

</style>
